define([],function (){

    const MuTreeInput = {
        template:`<el-tree
ref="eltree"
    style="max-width: 600px"
    :props="prop"
    :data="data"
    :node-key="keyField"
    show-checkbox
    @check-change="handleCheckChange"
  />`,
        props:{
            data:{
                type:Array,
                default:function (){
                    return []
                }
            },
            keyField:{
                type:String,
                default:'id'
            },
            prop:{
                type:Object,
                default:function (){
                    return {
                        children:'children',
                        label:'name'
                    }
                }
            },
            modelValue:String
        },
        emits:['update:modelValue'],
        data(){
            return {
                selectIds:[],
                locationVue:this.modelValue,
                nodekey:this.keyField,
            }
        },
        watch:{
            modelValue(newValue){
                this.locationVue = newValue
                this.csh()
            }
        },
        created(){
            // let
            // console.log(this.locationVue)
            if(this.locationVue){
                if((typeof this.locationVue)==='number'){
                    this.locationVue = this.locationVue.toString()
                }
                this.selectIds = this.locationVue.split(',')
            }
            if(this.selectIds.includes('*')){
                this.getChildIds();
            }
            // console.log(this.selectIds)
            let that = this;
            setTimeout(()=>{
                that.$refs.eltree.setCheckedKeys(that.selectIds,true,true)
            },300)
        },
        methods:{
            getChildIds(arry=null){
                if(arry==null){
                    arry = this.data
                }
                let that = this;
                arry.forEach(item=>{
                    if(!that.selectIds.includes(item[that.keyField])){
                        that.selectIds.push(item[that.keyField])
                    }
                    if(item.children&&item.children.length>0){
                        that.getChildIds(item.children)
                    }
                })
            },
            csh(){
              this.selectIds = this.locationVue.toString().split(',');
            },
            handleCheckChange(row){
                console.log(row)
                if(!this.selectIds.includes(row.id)){
                    let that = this
                    let selectIds = [];
                    let nodes = this.$refs.eltree.getCheckedNodes()
                    nodes.forEach(item=>{
                        selectIds.push(item[that.nodekey])
                    })
                    // console.log(selectIds)
                    this.$emit('update:modelValue',selectIds.join(','))
                }
            }
        }
    }
    return MuTreeInput
})